<template>
  <div class="medal">
    <div class="input">
      <van-cell-group>
        <van-field
          v-model="value1"
          clearable
          label="金牌"
          :left-icon="require(`../assets/jin.png`)"
          placeholder="金牌数量"
        />
        <van-field
          v-model="value2"
          clearable
          label="银牌"
          :left-icon="require(`../assets/yin.png`)"
          placeholder="银牌数量"
        />
        <van-field
          v-model="value3"
          clearable
          label="铜牌"
          :left-icon="require(`../assets/tong.png`)"
          placeholder="铜牌数量"
        />
      </van-cell-group>
    </div>
    <van-button type="info" class="button" @click="gai()">确 定</van-button>
    <div class="logo"></div>
  </div>
</template>
<script>
import { Toast } from 'vant';
export default {
  data() {
    return {
      value1: "",
      value2: "",
      value3: "",
    };
  },
  methods:{
    gai(){
    this.axios.put("/olympic/alter",`olid=1&gold=${this.value1}&Silver=${this.value2}&copper=${this.value3}`).then(result=>{
      Toast.success('修改成功');
    })
  }
  }
};
</script>

<style>
.medal {
  width: 100%;
  padding: 140px 0 0 0;
  background: url(../assets/index/aoyun.png) no-repeat;
  background-size: 100%;
}
.medal .input{
  margin: 40px 40px 10px 40px;
}
.medal .van-cell{
  font-size: 20px;
}
.medal .van-field__label{
  width: 3.5em;
}
.medal .van-icon__image{
  width: 2em;
  height: 2em;
}
.medal .van-cell__title{
  line-height: 35px;
}
.medal .van-field__control{
  line-height: 35px;
}
.medal .van-cell-group{
  border-radius: 10px;
}
.medal .logo{
  width: 100%;
  height: 240px;
  background:url(../assets/index/logo.png) no-repeat;
  background-size: 100%;
}
.medal .button{
  width: 80px;
  font-size: 16px;
  margin: 10px 0;
  border-radius: 30px;
  background-image: linear-gradient(45deg,#fad752,#dda600,#f5d356,#feec86);
  border: 2px solid #a9720c;
  color: #555;
  font-weight: 600;
  font-family: "微软雅黑";
}
</style>
